<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %><%--使用标签库--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>三峡大学小书屋-首页</title>
    <style>
        #div1{
            font-size: 14px;
            display: flex;
            justify-content: space-around;
            align-items: center;
            flex-wrap: wrap;
        }
        #div1>div{
            width: 20%;
            margin:10px 0px;
        }
        .shuiguo{
            width: 95%;
            height: 200px;
            margin: 5px auto;
        }
    </style>

    <link rel="stylesheet" type="text/css" href="..../../resource/css/style01.css" charset="utf-8">
    <link rel="stylesheet" href="../../resource/css/main.css">
    <link rel="stylesheet" href="../../resource/css/reset.css">

    <script type="text/javascript" src="../../resource/js/function.js"></script>
</head>

<body style="background:url(../../resource/images/sky.jpg) ;-webkit-background-size: cover;background-size:cover;">
<!-- 头部信息 -->
<div class="header_con">
    <div class="header">
        <div class="welcome" style="font-size: 15px;">欢迎来到三峡大学小书屋!</div>
        <div class="user_login" style="color: black;">
            用户名：${sessionScope.username}
            <span>|</span>
            <a href="forcart.do?uid=${sessionScope.uid}" style="color: black;" style="font-size: 15px;">我的购物车</a>
        </div>
    </div>
</div>

<div class="search_bar clearfix">
    <a href="#" class="logo fl" style="margin-left: 100px;">
        <img src="../../resource/images/logo.png" style="width: 250px;height: 58px;">
    </a>
    <div class="search_con fl">
        <form action="/toIndex.do" method="post">
            <input type="text" class="input_text fl" placeholder="  搜索商品" name="searchword">
            <input type="submit" class="input_btn fr" value="搜索">
        </form>
    </div>
</div>
<div id="main" class="wrap" >
    <div class="picturebox">
        <div id="container">
            <div id="photo">
                <img src="../../resource/images/33.jpg"/>
                <img src="../../resource/images/22.jpg"/>
                <img src="../../resource/images/11.jpg"/>
                <img src="../../resource/images/55.jpg"/>
                <img src="../../resource/images/44.jpg"/>
            </div>
        </div>
    </div>
    <div class="main">
        <div class="product-list">
            <h2>全部商品</h2>
          <%--  <div class="pager">
                <ul class="clearfix">
                    <li><a href="#">上一页</a></li>
                    <li class="current">1</li>
                    <li><a href="#">2</a></li>
                    <li><a href="#">3</a></li>
                    <li><a href="#">4</a></li>
                    <li><a href="#">5</a></li>
                    <li><a href="#">下一页</a></li>
                </ul>
            </div>--%>
            <div class="clear"></div>
            <ul class="product clearfix">
                <div id="div1">
                    <c:forEach items="${productsList}" var="pro">
                        <div>
                            <a href="detail.do?id=${pro.pid}">
                                <div class="shuiguo" style="background: url('${pro.imgurl}');background-size: 100% 100%;"></div>
                            </a>
                            <dd class="title"><a href="product-view.html" target="_blank" style="color: black;">${pro.pname}</a></dd>
                            <dd class="price" style="color: red;">￥${pro.price}</dd>
                        </div>
                    </c:forEach>
                </div>
            </ul>


            <div class="clear"></div>
            <%--<div class="pager">
                <ul class="clearfix">
                    <li><a href="#">上一页</a></li>
                    <li class="current">1</li>
                    <li><a href="#">2</a></li>
                    <li><a href="#">3</a></li>
                    <li><a href="#">4</a></li>
                    <li><a href="#">5</a></li>
                    <li><a href="#">下一页</a></li>
                </ul>
            </div>--%>
        </div>
    </div>
    <div class="clear"></div>
</div>
<div id="footer">
    Copyright &copy; 2021 三峡大学
</div>
</body>
</html>
